<template>
  <div class="sidebar-container" :class="{'is-active':isCollapse}">
    <el-menu unique-opened :default-active="nowTagValue" class="el-menu-vertical-demo" mode="vertical"
             :show-timeout="200" background-color="#00142a" text-color="hsla(0,0%,100%,.65)" active-text-color="#409eff"
             :collapse="isCollapse">
      <sidebar-item :menu="menu" :isCollapse="isCollapse"></sidebar-item>
    </el-menu>
  </div>
</template>

<script>
  import {initMenu, setUrlPath} from "@/util/util";
  import {mapGetters} from "vuex";
  import SidebarItem from "./SidebarItem";

  export default {
    name: "sidebar",
    components: {
      SidebarItem
    },
    data() {
      return {};
    },
    created() {
      initMenu(this.$router, this.menu);
    },
    computed: {
      ...mapGetters(["menu", "tag", "isCollapse"]),
      nowTagValue: function () {
        return setUrlPath(this.$route);
      }
    },
    mounted() {
    },
    methods: {}
  };
</script>

<style lang="scss" scoped>
</style>

